<template>
  <div class="entrance">
    <XqFormBuild
      v-if="isShow"
      ref="form"
      :dynamic-data="dynamicData"
      :form="form"
      :form-config="formConfig"
      :rules="rules"
      :select-map="selectMap"
      :temp-data="tempData"
      @update="onFormUpdate"
    />

    <div class="save">
      <div class="btn" @click="confirm">保存</div>
    </div>
    <u-toast ref="uToast" />
  </div>
</template>

<script>
import XqFormBuild from "@/components/XqForm/XqFormBuild";
import { buildForm, handleTailValue } from "@/components/XqForm/utils";
import { basicsPages } from "@/utils/dynamic";
import { mapState, mapGetters } from "vuex";
import {
  getEmpFieldValue,
  empFieldValueEdit
} from "@/services/employee";
export default {
  components: { XqFormBuild },
  data: () => ({
    isShow: false,
    dynamicData: {},
    form: null,
    formConfig: null,
    rules: null,
    selectMap: null,
    tempData: {},
    moduleData: {}
  }),
  computed: {
    ...mapGetters(['isJF']),
    ...mapState(["site", "employee", "user"]),
    verified() {
      return this.site.verified;
    }
  },
  mounted() {
    this.buildDynamicData();
    this.getEmpFieldValues();
  },

  // 页面周期函数--监听页面加载
  onLoad(option) {
    console.log(option);
    this.moduleData = uni.getStorageSync("module_data");
    console.log("debug log 12--> ", option);
    this.getMessageTemplateFieldsList();
    uni.setNavigationBarTitle({
      title: this.moduleData.moduleName
    });
  },

  // 页面处理函数--监听用户下拉动作
  onPullDownRefresh() {
    uni.stopPullDownRefresh();
  },
  // 页面处理函数--监听用户上拉触底
  onReachBottom() {},
  methods: {
    confirm() {
      this.$refs.form
        .getData()
        .then(res => {
          empFieldValueEdit({
            companyId: this.site.companyId,
            data: res,
            empInfoId: this.site.employeeId,
            moduleCode: this.moduleData.moduleCode
          })
            .then(result => {
              this.$refs.uToast.show({
                title: "保存成功",
                type: "success",
                duration: 400,
                callback: () => uni.navigateBack()
              });
            })
            .catch(err => {
              console.log("debug log --> ", err);
            });
        })
        .catch(err => {
          console.log("debug log --> ", err);
        });
    },

    getEmpFieldValues() {
      const data = {
        empInfoId: this.site.employeeId,
        companyId: this.site.companyId,
        moduleCode: uni.getStorageSync("module_data").moduleCode
      };
      getEmpFieldValue(data)
        .then(res => {
          console.log("debug log --> ", res.data);
          for (const key in res.data) {
            if (res.data[key]) {
              if (res.data[key].split("-").length - 1 === 2) {
                res.data[key] = res.data[key].split(" ")[0];
              }
            }
          }
          for (const key in res.data) {
            if (
              (key === "isFirstSoc" || key === "isFirstPf") &&
              res.data[key] === "true"
            ) {
              res.data[key] = true;
            }
            if (
              (key === "isFirstSoc" || key === "isFirstPf") &&
              res.data[key] === "false"
            ) {
              res.data[key] = false;
            }
          }
          this.tempData = res.data || {};
        })
        .catch(err => {
          console.log("debug log 失败--> ", err);
        });
    },

    getMessageTemplateFieldsList() {
      uni.showLoading({
        title: "表单加载中..."
      });
      const { form, formConfig, rules, selectMap } = buildForm(
        basicsPages(this.moduleData.moduleCode, [
          ...(this.moduleData.fieldList || []).filter(li => !(this.isJF && li.fieldCode === "postType")),
          ...(this.moduleData.additionalFieldList || [])
        ], true)
      );
      this.form = form;
      this.formConfig = formConfig;
      this.rules = rules;
      this.selectMap = selectMap;
      uni.hideLoading();
      this.$nextTick(() => {
        this.$refs.form.init();
      });
      uni.hideLoading();
      this.isShow = true;
    },
    buildDynamicData() {
      this.dynamicData = {};
    },
    onFormUpdate(tail, value) {
      handleTailValue(tail, value, this);
    }
  }
};
</script>

<style lang="scss" scoped>
.entrance {
  width: 100%;
  height: 100%;
  background-color: #ffffff;
}
.save {
  background-color: #ffffff;
  position: fixed;
  z-index: 10;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  .btn {
    width: 80%;
    height: 45;
    line-height: 45px;
    text-align: center;
    background-color: $uni-color-primary;
    font-size: 18px;
    color: #fff;
    border-radius: 10px;
  }
}
</style>
